<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>主页</title>
    <link rel="icon" type="images/x-icon" href="img/icons/favicon.ico">
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/font/css/font-awesome.min.css">
    <link rel="stylesheet" href="css/userPage.css">
    <link rel="stylesheet" href="css/selfItroduction.css">
    <link rel="stylesheet" href="css/player.css">
    <link rel="stylesheet" href="css/logReg.css" />
</head>
<body>
<!--头部 开始-->
<div class="SY-header pf">
    <div class="clearfix">
        <div class="SY-logo fl usn">
            <a href="UserCenter.html"><img src="img/icons/logo.png" alt="深夜学院"><span class="slogin">深夜研习社</span></a>
        </div>
        <div class="SY-search pa dib">
            <div class="inputField">
                <input type="text" class="SY-input tac" placeholder="请输入作者名" onfocus="this.placeholder=''" onblur="this.placeholder='请输入作者名'">
                <a href="javascript:void(0);" class="search-icon pa"><i class="fa fa-search"></i></a>
            </div>
            <div class="searchTips pa dn">
                <div class="searchReferral dn">
                    <div class="searchRecent">
                        <p class="title">最近搜索</p>
                        <ul class="clearfix">
                            <li class="worker dib fl"><a href="javascript:void(0);"><span>大石头</span>CG</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">Eric Zhang</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">作者名称</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">作者名称</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">作者名称</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">作者名称</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">作者名称</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">作者名称</a></li>
                        </ul>
                    </div>
                    <div class="searchHot">
                        <p class="title">热门搜索</p>
                        <ul class="clearfix">
                            <li class="worker dib fl"><a href="javascript:void(0);">大石头CG</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">Eric Zhang</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">作者名称</a></li>
                            <li class="worker dib fl"><a href="javascript:void(0);">作者名称</a></li>
                        </ul>
                    </div>
                </div>
                <div class="searchResult">
                    <ul class="d n">
                        <li class="worker"><a href="javascript:void(0);"><span>大石头</span>123</a></li>
                        <li class="worker"><a href="javascript:void(0);"><span>大石头</span>designer</a></li>
                        <li class="worker"><a href="javascript:void(0);"><span>大石头</span>icon</a></li>
                        <li class="worker title">创作者</li>
                        <li class="worker"><a href="javascript:void(0);"><span>大石头</span>CG</a></li>
                        <li class="worker"><a href="javascript:void(0);"><span>大石头</span>老师</a></li>
                        <li class="worker"><a href="javascript:void(0);"><span>大石头</span>老板</a></li>
                        <li class="worker"><a href="javascript:void(0);"><span>大石头</span>boss</a></li>
                    </ul>
                    <div class="checkMore tac d n">
                        <a href="javascript:void(0);">查看全部搜索结果<i class="fa fa-angle-double-right"></i></a>
                    </div>
                    <!--缺省提示-->
                    <div class="emptyInfo tac dn">
                        <p class="tips">暂未找到您想要查找的作,去<a href="MoreWorker.html">分类</a>查找更多作者吧!</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="SY-topRight fr">
            <ul class="clearfix">
                <li class="SY-create fr">
                    <a href="Post.html"><span>创作</span></a>
                </li>
                <li class="SY-userPic fr">
                    <a href="UserCenter.html">
                        <img class="br50" src="img/icons/person.png" alt="userPic">
                        <object><a href="javascript:void(0);"><span class="mark db pa approveBlue"></span></a></object>
                    </a>
                    <div class="pa tac fold">
                        <span class="pa trigon"></span>
                        <ul>
                            <li class="myPage"><a href="UserPageNew.html">我的研习社</a></li>
                            <li class="myPage"><a href="http://www.shenyecg.com" target="_blank">深夜学院</a></li>
                            <li class="authentication"><a href="CareerAuthen.html">深夜认证</a></li>
                            <li class="wallet"><a href="MyWallet.html">钱包</a></li>
                            <li class="setting"><a href="UserSetting.html">设置</a></li>
                            <li class="SY-exit">
                                <a href="javascript:void(0);"><i></i>退出</a>
                            </li>
                        </ul>
                    </div>
                </li>
                <li class="SY-regLog fr dn">
                    <a href="javascript:void(0);">注册</a>
                    <a href="javascript:void(0);">登录</a>
                </li>
                <li class="SY-notify fr">
                    <a href="Notify.html"><i></i><span class="num pa">99+</span></a>
                    <div class="pa fold">
                        <span class="pa trigon"></span>
                        <p class="topBox clearfix">
                            <span class="text fl">消息盒子</span>
                            <a href="javascript:void(0);" class="emptyBtn fr">清空</a>
                        </p>
                        <ul class="">
                            <li><a href="javascript:void(0);">[系统]管理员审核通过了你发表的原创作品《路人甲》</a></li>
                            <li><a href="javascript:void(0);">[私信]路人甲给你发来了1条私信</a></li>
                            <li><a href="javascript:void(0);">[通知]路人甲关注了你</a></li>
                        </ul>
                        <!--缺省提示-->
                        <div class="emptyInfo tac dn">
                            <p class="tips">暂无消息</p>
                        </div>
                        <div class="checkAll">
                            <a class="db tac" href="Notify.html">查看全部&nbsp;>></a>
                        </div>
                    </div>
                </li>
                <li class="fr line"></li>
                <li class="SY-focus dn fr">
                    <a href="UserCenter.html"><i></i><span>关注</span></a>
                </li>
                <li class="SY-Recruit fr">
                    <a href="Recruit.html"><i></i><span>招聘</span></a>
                    <span class="event db pa new"></span>
                </li>
                <li class="SY-piazza fr">
                    <a href="SquareNew.html"><i></i><span>广场</span></a>
                </li>
                <li class="SY-CG fr dn">
                    <a href="http://www.shenyecg.com" target="_blank"><i></i><span>学院</span></a>
                </li>
                <li class="SY-index fr dn">
                    <a href="Index.html"><i></i><span>首页</span></a>
                </li>
            </ul>
        </div>
    </div>
</div>
<!--头部 结束-->
<!--主内容 开始-->
<div class="SY-content">
    <div class="SY-mainContent">
        <div class="SY-bannerBox pr">
            <div class="cover pa"></div>
        </div>
        <div class="SY-wrapper wrap pr">
            <!--用户信息-->
            <div class="SY-userMsg pr">
                <a name="navAnchor" class="navAnchor pa"></a>
                <div class="user-avatar pa">
                    <a href="#"><img src="http://img.yxs.shenyecg.com/Image/h8VE1fiHlWerj0FrkEUSYlLa4m3sppLi/KECAnarYPG.jpg" alt=""></a>
                </div>
                <div class="user-msg clearfix">
                    <div class="user-detail fl">
                        <div class="user-nickName">
                            <h2 class="nickName dib toe"><a href="javascript:void(0);">这是用户的昵称</a></h2>
                            <a class="rewrite dib" href="javascript:void(0);"><i class="fa fa-pencil-square-o"></i></a>
                        </div>
                        <div class="user-defined">
                            <p class="user-career dib">用户的职业</p>
                            <p class="user-scocialAccount dib">
                                <a class="dib br50" href="javascript:void(0);"><i class="fa fa-weibo"></i></a>
                                <a class="dib br50" href="javascript:void(0);"><i class="fa fa-qq"></i></a>
                            </p>
                        </div>
                        <p class="user-describe toe">关于此用户的内容主题描述</p>
                    </div>
                    <div class="user-infos fr">
                        <div class="user-datas">
                            <a class="user-supporters dib tac" href="Follow.html">
                                <h3 class="feb num">5566</h3>
                                <p class="text">订阅</p>
                            </a>
                            <span class="line"></span>
                            <a class="user-fans dib tac" href="Follow.html">
                                <h3 class="feb num">8888</h3>
                                <p class="text">关注</p>
                            </a>
                        </div>
                        <div class="user-btns tac">
                            <a class="sendMsg-btn transition dib br5 pr" href="javascript:void(0);"><i class="fa fa-envelope-o"></i><span class="num pa db">2</span></a>
                            <a class="follow-btn transition dib br5" href="javascript:void(0);"><i class="fa fa-plus"></i>关注</a>
                        </div>
                    </div>
                </div>
            </div>
            <!--导航栏-->
            <div class="SY-navTab br5 usn clearfix">
                <!--左侧导航-->
                <ul class="fl clearfix tac">
                    <li class="item fl dib active"><a href="#navAnchor">主页</a></li>
                    <li class="item fl dib"><a href="#navAnchor">动态</a></li>
                    <li class="item fl dib"><a href="#navAnchor">留言板</a></li>
                </ul>
                <!--右侧按钮-->
                    <!--前往创作-->
                <div class="SY-toCreate fr dn">
                    <a class="db createBtn transition tac" href="javascript:void(0);">
                        <span class="icon dib"></span>
                        <span>前往创作</span>
                    </a>
                </div>
                    <!--订阅按钮-->
                <div class="SY-toSubscribe fr">
                    <a class="db subscribeBtn br5 transition tac" href="javascript:void(0);">订阅</a>
                </div>
            </div>
            <!--主内容-->
            <div class="SY-mainBox br5">
                <!--主页-->
                <div class="SY-mainPage clearfix">
                    <!--左侧内容-->
                    <div class="SY-left fl">
                        <!--loading-->
                        <div class="loading tac dn">
                            <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
                        </div>
                        <!--用户个人介绍-->
                        <div class="SY-introduce br5">
                            <h2 class="title">个人介绍</h2>
                            <div class="selfIntroduction">
                                <div class="introductVideo">
                                    <div id="t-video" class="video usn " style="position:relative;width:100%;height:100%;left:0;top:0;box-sizing:border-box;">
                                        <video id="playVideo" style="display: block; width: 100%; height: 100%;box-sizing:inherit;" src="http://www.shenyecg.com/video/multitude.mp4" poster="https://wx4.sinaimg.cn/crop.0.0.585.329.1000/006Tr4asly1fnyqrpm47og30ga095myx.gif" auto play=""></video>
                                        <div class="sewise-player-ui usn">
                                            <div class="controlbar transition">
                                                <div class="controlbar-bg">
                                                    控制栏背景
                                                </div>
                                                <div class="controlbar-btns">
                                                    <div class="controlbar-btn controlbar-div-play">
                                                        <a href="javascript:void(0);" class="controlbar-btns-play" tabindex="1">播放</a>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-div-pause">
                                                        <a href="javascript:void(0);" class="controlbar-btns-pause" tabindex="2">暂停</a>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-progress">
                                                        <div class="progressBox">
                                                            <div class="controlbar-progress-totalline br5"></div>
                                                            <div class="controlbar-progress-loadedline br5 transition" style="width: 60.391352%;"></div>
                                                            <div class="controlbar-progress-playedline br5 transition" style="width: 15.0466252%;">
                                                                <div class="controlbar-progress-playpoint transition br50"></div>
                                                            </div>
                                                            <div class="controlbar-progress-seekline"></div>
                                                            <div class="controlbar-progress-tip" current-time="" style="left: 20%;">
                                                                <span>30:00</span>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-div-time">
                                                        <div class="controlbar-playtime">
                                                            00:04
                                                        </div>
                                                        <div class="controlbar-playtime-split">
                                                            /
                                                        </div>
                                                        <div class="controlbar-totaltime">
                                                            155:11
                                                        </div>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-div-volume pr">
                                                        <div class="controlbar-div-volumeline pa">
                                                            <div class="controlbar-volumeline br5 pa">
                                                                <div class="controlbar-volumeline-bg br5">
                                                                </div>
                                                                <div class="controlbar-volumeline-volume transition br5 pa" style="height:48px;">
                                                                </div>
                                                                <div class="controlbar-volumeline-dragger">
                                                                </div>
                                                                <div class="controlbar-volumeline-point br50 pa">
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="controlbar-div-soundclose volume" style="display: none;">
                                                            <a href="javascript:void(0);" class="controlbar-btns-soundclose" tabindex="1"></a>
                                                        </div>
                                                        <div class="controlbar-div-soundopen volume" style="display: block;">
                                                            <a href="javascript:void(0);" class="controlbar-btns-soundopen" tabindex="1"></a>
                                                        </div>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-div-barrage">
                                                        <a href="javascript:void(0);" class="controlbar-btns-barrage close" tabindex="1"></a>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-div-palyRate pr">
                                                        <div class="controlbar-btns-menu br5" role="presentation">
                                                            <ul class="controlbar-btns-palyRate-content" role="menu">
                                                                <li class="controlbar-btns-palyRate-item" tabindex="-1" role="palyRateItem" aria-live="polite">4.0x<span class="vjs-control-text"></span></li>
                                                                <li class="controlbar-btns-palyRate-item" tabindex="-1" role="palyRateItem" aria-live="polite">3.0x<span class="vjs-control-text"></span></li>
                                                                <li class="controlbar-btns-palyRate-item" tabindex="-1" role="palyRateItem" aria-live="polite">2.0x<span class="vjs-control-text"></span></li>
                                                                <li class="controlbar-btns-palyRate-item" tabindex="-1" role="palyRateItem" aria-live="polite">1.75x<span class="vjs-control-text"></span></li>
                                                                <li class="controlbar-btns-palyRate-item" tabindex="-1" role="palyRateItem" aria-live="polite">1.5x<span class="vjs-control-text"></span></li>
                                                                <li class="controlbar-btns-palyRate-item" tabindex="-1" role="palyRateItem" aria-live="polite">1.25x<span class="vjs-control-text"></span></li>
                                                                <li class="controlbar-btns-palyRate-item active" tabindex="-1" role="palyRateItem" aria-live="polite">1.0x<span class="vjs-control-text"></span></li>
                                                            </ul>
                                                        </div>
                                                        <div class="controlbar-btns-palyRate br5">1.0x</div>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-div-resolution pr">
                                                        <div class="controlbar-btns-menu br5">
                                                            <ul class="controlbar-btns-resolution-content">
                                                                <li class="controlbar-btns-resolution-item">超清</li>
                                                                <li class="controlbar-btns-resolution-item active">高清</li>
                                                                <li class="controlbar-btns-resolution-item">普清</li>
                                                                <li class="controlbar-btns-resolution-item">自动</li>
                                                            </ul>
                                                        </div>
                                                        <div class="controlbar-btns-resolution br5">高清</div>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-div-fullscreen" style="display: block;">
                                                        <a href="javascript:void(0);" class="controlbar-btns-fullscreen" tabindex="1"></a>
                                                    </div>
                                                    <div class="controlbar-btn controlbar-div-normalscreen" style="display: none;">
                                                        <a href="javascript:void(0);" class="controlbar-btns-normalscreen" tabindex="1"></a>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="progressbar transition6 pa">
                                                <div class="progress-inner transition pa" style="width: 50%"></div>
                                            </div>
                                            <div class="logo" style="display: none;">
                                                <a href="http://www.shenyecg.com/" target="_blank" class="logo-icon" tabindex="1" style="">logo</a>
                                            </div>
                                            <div class="topbar" style="display: none;">
                                                <div class="topbar-program">
                                                    <div class="topbar-program-tip">
                                                        正在播放：
                                                    </div>
                                                    <div class="topbar-program-title">
                                                    </div>
                                                </div>
                                                <div class="topbar-clock">
                                                    2018-1-30 14:19:57
                                                </div>
                                            </div>
                                            <div class="buffer" style="display: none;">
                                                <div class="buffer-bg">
                                                    背景图片
                                                </div>
                                                <div class="buffer-text">
                                                    <div class="buffer-text-tip">
                                                    </div>
                                                    <div class="buffer-text-bufferPt">
                                                        ...
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="big-play-btn br50">
                                                <a href="javascript:void(0);" class="big-play-icon pause" tabindex="1"><i class="fa fa-play"></i></a>
                                                <a href="javascript:void(0);" class="big-play-icon replay" tabindex="1"><i class="fa fa-rotate-left"></i></a>
                                            </div>
                                            <div class="clarity-switch-btn" style="top: 0; margin-top: -5px;display: none;">
                                                <a href="javascript:void(0);" class="clarity-btn-text" tabindex="1">自动</a>
                                            </div>
                                            <div class="danmaku state-pause" id="danmu">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!--缺省提示-->
                            <div class="emptyInfo tac br5 dn">
                                <!--作者视角-->
                                <div class="yourself dn">
                                    <a href="http://art.shenyecg.com/Setting/Index" target="_blank" class="uploadBtn dib pr">
                                        <i class="fa fa-plus"></i><br>
                                        <span>设置个人介绍视频或者您最喜欢的作品视频</span><br>
                                        <span>（格式为MP4）</span>
                                    </a>
                                </div>
                                <!--用户视角-->
                                <p class="tips">该作者还没想好怎样介绍自己哦~</p>
                            </div>
                        </div>
                        <!--用户作品集-->
                        <div class="SY-album br5">
                            <div class="topBox clearfix">
                                <h2 class="title fl">作品集</h2>
                                <div class="controlBox fr">
                                    <a class="transition tac dib uploadBtn" href="UploadWork.html"><i class="fa fa-plus"></i>上传作品</a>
                                    <span class="line"></span>
                                    <a class="transition dib moreBtn" href="MoreAlbum.html">更多<i class="fa fa-angle-right"></i></a>
                                </div>
                            </div>
                            <div class="albumBox">
                                <ul class="clearfix">
                                    <li class="album-item al-video br5 fl">
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/jXnE9nZUDWbYkP8XulHOkexEOyZ3Ngff/wY4sNbhjFJ.jpg')">
                                            <div class="coverPic pa"></div>
                                            <div class="playIcon pa"><i class="fa fa-play-circle-o"></i></div>
                                            <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                            <div class="item-msg pa clearfix">
                                                <h3 class="item-name toe">这是作品集的名称</h3>
                                                <div class="item-detail fl">
                                                    <p class="item-time">2018-05-21</p>
                                                </div>
                                                <div class="item-society fr tar">
                                                    <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                    <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="album-item al-picture br5 fl">
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/z606eWthgRhkBlQLiYqiMRaTDQs6ynNy/tCPE4nG5xp.jpg')">
                                            <div class="coverPic pa"></div>
                                            <div class="picIcon br5 pa"><i class="fa fa-picture-o"></i><span class="num">7</span></div>
                                            <div class="item-msg pa clearfix">
                                                <h3 class="item-name toe">这是作品集的名称</h3>
                                                <div class="item-detail fl">
                                                    <p class="item-time">2018-05-21</p>
                                                </div>
                                                <div class="item-society fr tar">
                                                    <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                    <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="album-item al-picture br5 fl">
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/47dWz3gCuTRlkUArqJc4IzVGyybCdxtB/8k7mwRb63W.jpg')">
                                            <div class="coverPic pa"></div>
                                            <div class="picIcon br5 pa"><i class="fa fa-picture-o"></i><span class="num">7</span></div>
                                            <div class="item-msg pa clearfix">
                                                <h3 class="item-name toe">这是作品集的名称</h3>
                                                <div class="item-detail fl">
                                                    <p class="item-time">2018-05-21</p>
                                                </div>
                                                <div class="item-society fr tar">
                                                    <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                    <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="album-item al-video br5 fl">
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/UCc5a0RKXquiPa33blCYiOuL8D1FFyRG/6N5EGQR4zW.jpg')">
                                            <div class="coverPic pa"></div>
                                            <div class="playIcon pa"><i class="fa fa-play-circle-o"></i></div>
                                            <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                            <div class="item-msg pa clearfix">
                                                <h3 class="item-name toe">这是作品集的名称</h3>
                                                <div class="item-detail fl">
                                                    <p class="item-time">2018-05-21</p>
                                                </div>
                                                <div class="item-society fr tar">
                                                    <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                    <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="album-item al-video br5 fl">
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/7lAOvgftYM8yYLQuEZI7IxzEQ4iHOUBD/B2DMMdAj4Q.jpg')">
                                            <div class="coverPic pa"></div>
                                            <div class="playIcon pa"><i class="fa fa-play-circle-o"></i></div>
                                            <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                            <div class="item-msg pa clearfix">
                                                <h3 class="item-name toe">这是作品集的名称</h3>
                                                <div class="item-detail fl">
                                                    <p class="item-time">2018-05-21</p>
                                                </div>
                                                <div class="item-society fr tar">
                                                    <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                    <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="album-item al-picture br5 fl">
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/GU5ZX4UfdpBsuue45ntTt9ROci8iGAwE/2F8TPDdJrP.jpg')">
                                            <div class="coverPic pa"></div>
                                            <div class="picIcon br5 pa"><i class="fa fa-picture-o"></i><span class="num">7</span></div>
                                            <div class="item-msg pa clearfix">
                                                <h3 class="item-name toe">这是作品集的名称</h3>
                                                <div class="item-detail fl">
                                                    <p class="item-time">2018-05-21</p>
                                                </div>
                                                <div class="item-society fr tar">
                                                    <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                    <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="album-item al-video br5 fl">
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/gwM0VXojutfpDXPXjWM65aGtXV74Z0ek/tF2FB5G7WN.jpg')">
                                            <div class="coverPic pa"></div>
                                            <div class="playIcon pa"><i class="fa fa-play-circle-o"></i></div>
                                            <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                            <div class="item-msg pa clearfix">
                                                <h3 class="item-name toe">这是作品集的名称</h3>
                                                <div class="item-detail fl">
                                                    <p class="item-time">2018-05-21</p>
                                                </div>
                                                <div class="item-society fr tar">
                                                    <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                    <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="album-item al-picture br5 fl">
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/W1fUd7SlRVlLPPt6m6DKMDDZ2gEDler9/y4b8Q5m63X.jpg')">
                                            <div class="coverPic pa"></div>
                                            <div class="picIcon br5 pa"><i class="fa fa-picture-o"></i><span class="num">7</span></div>
                                            <div class="item-msg pa clearfix">
                                                <h3 class="item-name toe">这是作品集的名称</h3>
                                                <div class="item-detail fl">
                                                    <p class="item-time">2018-05-21</p>
                                                </div>
                                                <div class="item-society fr tar">
                                                    <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                    <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                            <!--缺省提示-->
                            <div class="emptyInfo tac dn">
                                <!--作者视角-->
                                <p class="tips">你可以将自己上传的作品整理成合集，方便别人观看哦~<a href="javascript:void(0);">立即上传</a></p>
                                <!--用户视角-->
                                <p class="tips dn">该作者还没有上传自己的作品哦~</p>
                            </div>
                        </div>
                        <!--用户教程-->
                        <div class="SY-userAlbumBox">
                            <!--教程列表-->
                            <div class="userAlbumList">
                                <div class="userAlbum br5">
                                    <div class="topBox clearfix">
                                        <h2 class="title fl">这是一个系列教程</h2>
                                        <div class="controlBox fr">
                                            <a class="transition dib editBtn" href="BuildNewAlbum.html">编辑</a>
                                            <span class="line"></span>
                                            <a class="transition dib moreBtn" href="">更多<i class="fa fa-angle-right"></i></a>
                                        </div>
                                    </div>
                                    <div class="albumList">
                                        <ul class="clearfix">
                                            <li class="album-item border1 al-video br5 fl">
                                                <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/gwM0VXojutfpDXPXjWM65aGtXV74Z0ek/tF2FB5G7WN.jpg')">
                                                    <div class="coverPic pa"></div>
                                                    <div class="playIcon pa"><i class="fa fa-play-circle-o"></i></div>
                                                    <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                                </a>
                                                <div class="item-msg">
                                                    <a href="javascript:void(0);" class="item-name toe">这是作品集的名称</a>
                                                    <div class="item-detail">
                                                        <p class="item-time">2018-05-15</p>
                                                    </div>
                                                    <div class="item-society">
                                                        <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                        <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">200</span></p>
                                                        <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                    </div>
                                                </div>
                                            </li>
                                            <li class="album-item border1 al-article br5 fl">
                                                <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/YnCyp07dIvRz2rYwz4HFJE9sxR2pp1CR/MYbFsK7ZAi.jpg')">
                                                    <div class="coverPic pa"></div>
                                                    <div class="articleIcon br50 tac pa"><i class="fa fa-file-text"></i></div>
                                                </a>
                                                <div class="item-msg">
                                                    <a href="javascript:void(0);" class="item-name toe">这是作品集的名称</a>
                                                    <div class="item-detail">
                                                        <p class="item-time">2018-05-15</p>
                                                    </div>
                                                    <div class="item-society">
                                                        <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                        <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">200</span></p>
                                                        <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                    </div>
                                                </div>
                                            </li>
                                            <li class="album-item border1 al-video br5 fl">
                                                <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/7lAOvgftYM8yYLQuEZI7IxzEQ4iHOUBD/B2DMMdAj4Q.jpg')">
                                                    <div class="coverPic pa"></div>
                                                    <div class="playIcon pa"><i class="fa fa-play-circle-o"></i></div>
                                                    <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                                </a>
                                                <div class="item-msg">
                                                    <a href="javascript:void(0);" class="item-name toe">这是作品集的名称</a>
                                                    <div class="item-detail">
                                                        <p class="item-time">2018-05-15</p>
                                                    </div>
                                                    <div class="item-society">
                                                        <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                        <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">200</span></p>
                                                        <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                    </div>
                                                </div>
                                            </li>
                                            <li class="album-item border1 al-living br5 fl">
                                                <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/r8xrjVZRDT0egMtibaJ4Xs8XSvNvWyKc/7MGfiXExYb.jpg')">
                                                    <div class="coverPic pa"></div>
                                                    <div class="livingIcon tac br5 pa"><i class="fa fa-video-camera"></i></div>
                                                </a>
                                                <div class="item-msg">
                                                    <a href="javascript:void(0);" class="item-name toe">这是作品集的名称</a>
                                                    <div class="item-detail">
                                                        <p class="item-time">2018-05-15</p>
                                                    </div>
                                                    <div class="item-society">
                                                        <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                        <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">200</span></p>
                                                        <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                    </div>
                                                </div>
                                            </li>
                                            <li class="album-item border1 al-picture br5 fl">
                                                <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/LNALBSqKgx7UUgyDLyDK5PFhfPxAARUV/ChBf38iddA.jpg')">
                                                    <div class="coverPic pa"></div>
                                                    <div class="picIcon br5 pa"><i class="fa fa-picture-o"></i><span class="num">7</span></div>
                                                </a>
                                                <div class="item-msg">
                                                    <a href="javascript:void(0);" class="item-name toe">这是作品集的名称</a>
                                                    <div class="item-detail">
                                                        <p class="item-time">2018-05-15</p>
                                                    </div>
                                                    <div class="item-society">
                                                        <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                        <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">200</span></p>
                                                        <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                    </div>
                                                </div>
                                            </li>
                                            <li class="album-item border1 al-video br5 fl">
                                                <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/UCc5a0RKXquiPa33blCYiOuL8D1FFyRG/6N5EGQR4zW.jpg')">
                                                    <div class="coverPic pa"></div>
                                                    <div class="playIcon pa"><i class="fa fa-play-circle-o"></i></div>
                                                    <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                                </a>
                                                <div class="item-msg">
                                                    <a href="javascript:void(0);" class="item-name toe">这是作品集的名称</a>
                                                    <div class="item-detail">
                                                        <p class="item-time">2018-05-15</p>
                                                    </div>
                                                    <div class="item-society">
                                                        <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                        <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">200</span></p>
                                                        <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                    </div>
                                                </div>
                                            </li>
                                            <li class="album-item border1 al-article br5 fl">
                                                <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/Zra8ge6whg7s7eVTfzg1jAqjaKbdRZxu/DCyBzXpGdd.jpg')">
                                                    <div class="coverPic pa"></div>
                                                    <div class="articleIcon br50 tac pa"><i class="fa fa-file-text"></i></div>
                                                </a>
                                                <div class="item-msg">
                                                    <a href="javascript:void(0);" class="item-name toe">这是作品集的名称</a>
                                                    <div class="item-detail">
                                                        <p class="item-time">2018-05-15</p>
                                                    </div>
                                                    <div class="item-society">
                                                        <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                        <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">200</span></p>
                                                        <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                    </div>
                                                </div>
                                            </li>
                                            <li class="album-item border1 al-video br5 fl">
                                                <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/P8vn2ccb0jAnU0SY5ghCqdJNNrHrm1Lo/Sk6CZe82GT.jpg')">
                                                    <div class="coverPic pa"></div>
                                                    <div class="playIcon pa"><i class="fa fa-play-circle-o"></i></div>
                                                    <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                                </a>
                                                <div class="item-msg">
                                                    <a href="javascript:void(0);" class="item-name toe">这是作品集的名称</a>
                                                    <div class="item-detail">
                                                        <p class="item-time">2018-05-15</p>
                                                    </div>
                                                    <div class="item-society">
                                                        <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                        <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">200</span></p>
                                                        <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <!--缺省提示-->
                                    <div class="emptyInfo tac dn">
                                        <p class="tips">该合集暂无作品，赶快去<a href="">添加</a>作品吧~</p>
                                    </div>
                                </div>
                                <div class="userAlbum br5">
                                    <div class="topBox clearfix">
                                        <h2 class="title fl">这是一个系列教程</h2>
                                        <div class="controlBox fr">
                                            <a class="transition dib editBtn" href="BuildNewAlbum.html">编辑</a>
                                            <span class="line"></span>
                                            <a class="transition dib moreBtn" href="">更多<i class="fa fa-angle-right"></i></a>
                                        </div>
                                    </div>
                                    <div class="albumList">
                                        <ul class="clearfix">
                                            <li class="album-item border1 al-picture br5 fl">
                                                <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/W1fUd7SlRVlLPPt6m6DKMDDZ2gEDler9/y4b8Q5m63X.jpg')">
                                                    <div class="coverPic pa"></div>
                                                    <div class="picIcon br5 pa"><i class="fa fa-picture-o"></i><span class="num">7</span></div>
                                                </a>
                                                <div class="item-msg">
                                                    <a href="javascript:void(0);" class="item-name toe">这是作品集的名称</a>
                                                    <div class="item-detail">
                                                        <p class="item-time">2018-05-15</p>
                                                    </div>
                                                    <div class="item-society">
                                                        <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                        <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">200</span></p>
                                                        <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                    </div>
                                                </div>
                                            </li>
                                            <li class="album-item border1 al-video br5 fl">
                                                <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/jXnE9nZUDWbYkP8XulHOkexEOyZ3Ngff/wY4sNbhjFJ.jpg')">
                                                    <div class="coverPic pa"></div>
                                                    <div class="playIcon pa"><i class="fa fa-play-circle-o"></i></div>
                                                    <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                                </a>
                                                <div class="item-msg">
                                                    <a href="javascript:void(0);" class="item-name toe">这是作品集的名称</a>
                                                    <div class="item-detail">
                                                        <p class="item-time">2018-05-15</p>
                                                    </div>
                                                    <div class="item-society">
                                                        <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                        <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">200</span></p>
                                                        <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                    </div>
                                                </div>
                                            </li>
                                            <li class="album-item border1 al-picture br5 fl">
                                                <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/z606eWthgRhkBlQLiYqiMRaTDQs6ynNy/tCPE4nG5xp.jpg')">
                                                    <div class="coverPic pa"></div>
                                                    <div class="picIcon br5 pa"><i class="fa fa-picture-o"></i><span class="num">7</span></div>
                                                </a>
                                                <div class="item-msg">
                                                    <a href="javascript:void(0);" class="item-name toe">这是作品集的名称</a>
                                                    <div class="item-detail">
                                                        <p class="item-time">2018-05-15</p>
                                                    </div>
                                                    <div class="item-society">
                                                        <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                        <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">200</span></p>
                                                        <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                    </div>
                                                </div>
                                            </li>
                                            <li class="album-item border1 al-living br5 fl">
                                                <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/D4mzDy8vWFOdjMj635sXriTBjI2R0cd3/Tjmw2Y8mym.jpg')">
                                                    <div class="coverPic pa"></div>
                                                    <div class="livingIcon tac br5 pa"><i class="fa fa-video-camera"></i></div>
                                                </a>
                                                <div class="item-msg">
                                                    <a href="javascript:void(0);" class="item-name toe">这是作品集的名称</a>
                                                    <div class="item-detail">
                                                        <p class="item-time">2018-05-15</p>
                                                    </div>
                                                    <div class="item-society">
                                                        <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                        <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">200</span></p>
                                                        <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                    </div>
                                                </div>
                                            </li>
                                            <li class="album-item border1 al-living br5 fl">
                                                <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/PXDgEHnfVLHTqS8MdQjSqxDXVf6kDXcJ/XWHfJNECtP.jpg')">
                                                    <div class="coverPic pa"></div>
                                                    <div class="livingIcon tac br5 pa"><i class="fa fa-video-camera"></i></div>
                                                </a>
                                                <div class="item-msg">
                                                    <a href="javascript:void(0);" class="item-name toe">这是作品集的名称</a>
                                                    <div class="item-detail">
                                                        <p class="item-time">2018-05-15</p>
                                                    </div>
                                                    <div class="item-society">
                                                        <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                        <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">200</span></p>
                                                        <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                    </div>
                                                </div>
                                            </li>
                                            <li class="album-item border1 al-article br5 fl">
                                                <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/009/544/439/smaller_square/baatr-kotinov-.jpg?1519595974')">
                                                    <div class="coverPic pa"></div>
                                                    <div class="articleIcon br50 tac pa"><i class="fa fa-file-text"></i></div>
                                                </a>
                                                <div class="item-msg">
                                                    <a href="javascript:void(0);" class="item-name toe">这是作品集的名称</a>
                                                    <div class="item-detail">
                                                        <p class="item-time">2018-05-15</p>
                                                    </div>
                                                    <div class="item-society">
                                                        <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                        <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">200</span></p>
                                                        <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                    </div>
                                                </div>
                                            </li>
                                            <li class="album-item border1 al-article br5 fl">
                                                <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/009/537/563/smaller_square/yang-tian-pansen.jpg?1519569817')">
                                                    <div class="coverPic pa"></div>
                                                    <div class="articleIcon br50 tac pa"><i class="fa fa-file-text"></i></div>
                                                </a>
                                                <div class="item-msg">
                                                    <a href="javascript:void(0);" class="item-name toe">这是作品集的名称</a>
                                                    <div class="item-detail">
                                                        <p class="item-time">2018-05-15</p>
                                                    </div>
                                                    <div class="item-society">
                                                        <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                        <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">200</span></p>
                                                        <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                    </div>
                                                </div>
                                            </li>
                                            <li class="album-item border1 al-video br5 fl">
                                                <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Image/ubvNxkRcHS840Krbq4ORbdTLCrnCKNam/yGCQyyJDza.jpg')">
                                                    <div class="coverPic pa"></div>
                                                    <div class="playIcon pa"><i class="fa fa-play-circle-o"></i></div>
                                                    <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                                </a>
                                                <div class="item-msg">
                                                    <a href="javascript:void(0);" class="item-name toe">这是作品集的名称</a>
                                                    <div class="item-detail">
                                                        <p class="item-time">2018-05-15</p>
                                                    </div>
                                                    <div class="item-society">
                                                        <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">200</span></p>
                                                        <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">200</span></p>
                                                        <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">200</span></p>
                                                    </div>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <!--缺省提示-->
                                    <div class="emptyInfo tac dn">
                                        <p class="tips">该合集暂无作品，赶快去<a href="">添加</a>作品吧~</p>
                                    </div>
                                </div>
                            </div>
                            <!--缺省提示-->
                            <div class="emptyInfo br5 tac dn">
                                <h2 class="title tal">合集项目</h2>
                                <!--作者视角-->
                                <p class="tips">暂时没有合集作品，赶快去新建一个合集吧~<a href="javascript:void(0);">立即新建</a></p>
                                <!--用户视角-->
                                <p class="tips dn">该作者暂时没有自己的合集作品哦~</p>
                            </div>
                            <!--新建合集-->
                            <div class="buildNew br5">
                                <a class="db tac" href="BuildNewAlbum.html">
                                    <i class="fa fa-plus"></i><span>新建合集</span>
                                </a>
                            </div>
                        </div>
                        <!--作者推荐作品-->
                        <div class="SY-recommendWork br5">
                            <h2 class="title">作者推荐</h2>
                            <div class="userRecommend">
                                <!--图片-->
                                <div class="recommend-item clearfix">
                                    <div class="item-pic re-picture br5 fl pr">
                                        <div class="morePic tac br5 pa">
                                            <i class="fa fa-picture-o"></i>
                                            <span class="num">7</span>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Gallery/iPWeMRutjGRqjpz694WY6Hucxu0KLxeC/DzM9dqEAsJNsgHrIyJEyG6r14723yIg6jNPAB57m1RYxkM_O6G9Y764xyOaunIC8.jpg')">
                                        </a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-title toe fl" href="javascript:void(0)">这是该图片的名称</a>
                                            <p class="item-price fr"><i class="fa fa-unlock"></i><span>￥1--黑豹课程</span></p>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i><span>取消推荐</span></a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>下架</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="recommend-item pay clearfix">
                                    <div class="item-pic picture br5 fl pr">
                                        <div class="morePic tac br5 pa">
                                            <i class="fa fa-picture-o"></i>
                                            <span class="num">7</span>
                                        </div>
                                        <div class="lockCover tac pa">
                                            <p class="icon"><i class="fa fa-lock"></i></p>
                                            <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Gallery/iPWeMRutjGRqjpz694WY6Hucxu0KLxeC/DzM9dqEAsJNsgHrIyJEyG6r14723yIg6jNPAB57m1RYxkM_O6G9Y764xyOaunIC8.jpg')">
                                            <div class="cover pa transition"></div>
                                        </a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-title toe fl" href="javascript:void(0)">这是该图片的名称</a>
                                            <p class="item-price fr"><i class="fa fa-lock"></i><span>￥1--黑豹课程</span></p>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i><span>推荐</span></a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>下架</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!--视频-->
                                <div class="recommend-item clearfix">
                                    <div class="item-pic re-video br5 fl pr">
                                        <div class="playIcon pa">
                                            <i class="fa fa-play-circle-o"></i>
                                        </div>
                                        <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/000/826/927/large/wl-op-1.jpg?1443929888')">
                                            <div class="cover transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-title toe fl" href="javascript:void(0)">这是该视频的名称</a>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i><span>取消推荐</span></a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>下架</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="recommend-item pay clearfix">
                                    <div class="item-pic re-video  br5 fl pr">
                                        <div class="lockCover tac pa">
                                            <p class="icon"><i class="fa fa-lock"></i></p>
                                            <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                        </div>
                                        <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/000/826/927/large/wl-op-1.jpg?1443929888')">
                                            <div class="cover transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-title toe fl" href="javascript:void(0)">这是该视频的名称</a>
                                            <p class="item-price fr"><i class="fa fa-lock"></i><span>￥1--黑豹课程</span></p>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i><span>取消推荐</span></a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>下架</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!--直播-->
                                <div class="recommend-item clearfix">
                                    <div class="item-pic re-living br5 fl pr">
                                        <div class="livingTip tac br5 pa">
                                            <i class="fa fa-video-camera"></i>
                                        </div>
                                        <div class="living pa tac">
                                            <div class="liveSoon dn">
                                                <p class="text">即将直播</p>
                                                <p class="text timeTip">距离直播开始还剩<br><span class="day">30</span>天<span class="hour">23</span>小时<span class="minute">30</span>分</p>
                                            </div>
                                            <div class="liveNow d n">
                                                <p class="livingIcon"></p>
                                                <p class="text">正在直播</p>
                                            </div>
                                            <div class="livefinish dn">
                                                <p class="text">直播已结束</p>
                                            </div>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/001/337/630/large/wl-op-7s.jpg?1444639378')">
                                            <div class="cover transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-title toe fl" href="javascript:void(0)">这是该直播的名称</a>
                                            <p class="item-price fr"><i class="fa fa-unlock"></i><span>￥1--黑豹课程</span></p>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i><span>取消推荐</span></a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>下架</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="recommend-item pay clearfix">
                                    <div class="item-pic re-living br5 fl pr">
                                        <div class="livingTip tac br5 pa">
                                            <i class="fa fa-video-camera"></i>
                                        </div>
                                        <div class="lockCover tac pa">
                                            <p class="icon"><i class="fa fa-lock"></i></p>
                                            <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/001/337/630/large/wl-op-7s.jpg?1444639378')">
                                            <div class="cover transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-title toe fl" href="javascript:void(0)">这是该直播的名称</a>
                                            <p class="item-price fr"><i class="fa fa-lock"></i><span>￥1--黑豹课程</span></p>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i><span>取消推荐</span></a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>下架</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!--文章-->
                                <div class="recommend-item clearfix">
                                    <div class="item-pic re-article br5 fl pr">
                                        <div class="articleIcon br50 tac pa">
                                            <i class="fa fa-file-text"></i>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://wx1.sinaimg.cn/crop.0.39.800.449.1000/006Tr4asgy1fnrrrnjfhij30m80fojw8.jpg')"></a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-title toe fl" href="javascript:void(0)">这是该文章的名称</a>
                                            <p class="item-price fr"><i class="fa fa-unlock"></i><span>￥1--黑豹课程</span></p>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i><span>取消推荐</span></a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>下架</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="recommend-item pay clearfix">
                                    <div class="item-pic re-article br5 fl pr">
                                        <div class="articleIcon br50 tac pa">
                                            <i class="fa fa-file-text"></i>
                                        </div>
                                        <div class="lockCover tac pa">
                                            <p class="icon"><i class="fa fa-lock"></i></p>
                                            <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://wx1.sinaimg.cn/crop.0.39.800.449.1000/006Tr4asgy1fnrrrnjfhij30m80fojw8.jpg')">
                                            <div class="cover transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-title toe fl" href="javascript:void(0)">这是该文章的名称</a>
                                            <p class="item-price fr"><i class="fa fa-lock"></i><span>￥1--黑豹课程</span></p>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i><span>取消推荐</span></a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>下架</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!--文本-->
                                <div class="recommend-item clearfix">
                                    <div class="item-infos re-text fl pr">
                                        <div class="putTop pa">
                                            <i class="fa fa-bookmark"></i>
                                            <span class="pa">顶</span>
                                        </div>
                                        <div class="item-top clearfix">
                                            <p class="item-price fr"><i class="fa fa-unlock"></i><span>￥1--黑豹课程</span></p>
                                            <span class="item-time fr">2018-05-15</span>
                                        </div>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i><span>取消推荐</span></a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>下架</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="recommend-item pay clearfix">
                                    <div class="item-pic re-text br5 fl pr">
                                        <div class="articleIcon br50 tac pa">
                                            <i class="fa fa-file-text"></i>
                                        </div>
                                        <div class="lockCover tac pa">
                                            <p class="icon"><i class="fa fa-lock"></i></p>
                                            <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('img/personalCenter/defaultPic.jpg')">
                                            <div class="cover transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-text toe fl" href="javascript:void(0)">该文本的缩略内容该文本的缩略内容该文本的缩略内容</a>
                                            <p class="item-price fr"><i class="fa fa-lock"></i><span>￥1--黑豹课程</span></p>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-desc"></p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i><span>取消推荐</span></a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>下架</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!--缺省提示-->
                            <div class="emptyInfo tac dn">
                                <!--作者视角-->
                                <p class="tips">暂时没有推荐作品，赶快去<a href="javascript:void(0);">动态</a>中设置吧~</p>
                                <!--用户视角-->
                                <p class="tips dn">该作者暂时没有推荐作品哦~</p>
                            </div>
                        </div>
                    </div>
                    <!--右侧内容-->
                    <div class="SY-right fr">
                        <!--loading-->
                        <div class="loading tac dn">
                            <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
                        </div>
                        <!--直播提示-->
                        <div class="SY-liveTip br5">
                            <ul class="tipNav usn">
                                <li class="dib active"><a href="javascript:void(0);">正在直播</a></li>
                                <li class="dib"><a href="javascript:void(0);">即将直播</a></li>
                            </ul>
                            <div class="mainTipBox">
                                <div class="liveNow">
                                    <div class="mainMsg br5 pr">
                                        <div class="living pa tac">
                                            <div class="liveNow">
                                                <p class="livingIcon"></p>
                                                <p class="text">正在直播</p>
                                            </div>
                                            <div class="livefinish dn">
                                                <p class="text">直播已结束</p>
                                            </div>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image: url('https://cdna.artstation.com/p/assets/images/images/001/337/630/large/wl-op-7s.jpg?1444639378')">
                                            <div class="cover transition pa"></div>
                                        </a>
                                    </div>
                                    <h2 class="livingTitle">这是本次直播的标题</h2>
                                </div>
                                <div class="liveSoon dn">
                                    <div class="mainMsg br5 pr">
                                        <div class="living pa tac">
                                            <div class="liveSoon">
                                                <p class="text">即将直播</p>
                                                <p class="text timeTip">距离直播开始还剩<br><span class="day">30</span>天<span class="hour">23</span>小时<span class="minute">30</span>分</p>
                                            </div>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image: url('http://img.yxs.shenyecg.com/Image/r8xrjVZRDT0egMtibaJ4Xs8XSvNvWyKc/7MGfiXExYb.jpg')">
                                            <div class="cover transition pa"></div>
                                        </a>
                                    </div>
                                    <h2 class="livingTitle">这是即将直播的标题</h2>
                                </div>
                            </div>
                        </div>
                        <!--公告-->
                        <div class="SY-announcement br5">
                            <div class="announcement dn">
                                <div class="topBox clearfix">
                                    <h2 class="title fl">公告</h2>
                                    <p class="time fr">发布于<span>2018-05-17</span></p>
                                </div>
                                <p class="text">下个月18日晚上6点我会开启我的首次直播，同学们记得来捧场</p>
                                <div class="btns tar">
                                    <a class="edit" href="javascript:void(0);">编辑</a>
                                </div>
                            </div>
                            <!--缺省提示-->
                            <div class="emptyInfo">
                                <h2 class="title">公告</h2>
                                <p class="tips tac">暂无公告，赶快<a href="javascript:void(0);">添加</a>吧~</p>
                            </div>
                            <!--编辑公告-->
                            <div class="editAnnounce dn">
                                <h2 class="title">公告</h2>
                                <div class="editBox br5 border1 pr">
                                    <textarea placeholder="暂无公告内容" onfocus="this.placeholder=''" onblur="this.placeholder='暂无公告内容'"></textarea>
                                    <span class="wordsLimit warning pa"><i>0</i>/150</span>
                                </div>
                                <div class="btns tar">
                                    <a class="save" href="javascript:void(0);">保存</a>
                                    <a class="cancel" href="javascript:void(0);">取消</a>
                                </div>
                            </div>
                        </div>
                        <!--阶段目标-->
                        <div class="SY-target br5" style="overflow: hidden;">
                            <div class="targetBox">
                                <div class="changeBtn clearfix">
                                    <p class="title fl">阶段目标</p>
                                    <p class="btns br5 border1 fr clearfix">
                                        <a href="javascript:void(0);" class="prev fl transition dib tac disable"><i class="fa fa-angle-left"></i></a>
                                        <a href="javascript:void(0);" class="next fl transition dib tac"><i class="fa fa-angle-right"></i></a>
                                    </p>
                                </div>
                                <div class="targetProgress pr clearfix">
                                    <div class="target pr fl">
                                        <p class="goalTxt">
                                            <span class="complete">已完成<em class="feb">89</em></span>
                                            <span class="uncomlplete">目标<em class="feb">300</em></span>
                                        </p>
                                        <div class="progress br5 pr">
                                            <p class="record br5 transition pa"></p>
                                        </div>
                                        <p class="text">
                                            关于这个目标的描述，达到目标后会做什么事情。关于这个目标的描述，达到目标后会做什么事情。关于这个目标的描述，达到目标后会做什么事情。
                                        </p>
                                    </div>
                                    <div class="target pr fl">
                                        <p class="goalTxt">
                                            <span class="complete">已完成<em class="feb">300</em></span>
                                            <span class="uncomlplete">目标<em class="feb">600</em></span>
                                        </p>
                                        <div class="progress br5 pr">
                                            <p class="record br5 pa"></p>
                                        </div>
                                        <p class="text">
                                            关于这个目标的描述，达到目标后会做什么事情。关于这个目标的描述，达到目标后会做什么事情。
                                        </p>
                                    </div>
                                    <div class="target pr fl">
                                        <p class="goalTxt">
                                            <span class="complete">已完成<em class="feb">600</em></span>
                                            <span class="uncomlplete">目标<em class="feb">1000</em></span>
                                        </p>
                                        <div class="progress br5 pr">
                                            <p class="record br5 pa"></p>
                                        </div>
                                        <p class="text">
                                            关于这个目标的描述，达到目标后会做什么事情。关于这个目标的描述，达到目标后会做什么事情。
                                        </p>
                                    </div>
                                    <div class="target pr fl">
                                        <p class="goalTxt">
                                            <span class="complete">已完成<em class="feb">1000</em></span>
                                            <span class="uncomlplete">目标<em class="feb">1500</em></span>
                                        </p>
                                        <div class="progress br5 pr">
                                            <p class="record br5 pa"></p>
                                        </div>
                                        <p class="text">
                                            关于这个目标的描述，达到目标后会做什么事情。关于这个目标的描述，达到目标后会做什么事情。
                                        </p>
                                    </div>
                                </div>
                            </div>
                            <!--缺省提示-->
                            <div class="emptyInfo tac dn">
                                <a class="db transition setTargetBtn" href="javascript:void(0);"><i class="fa fa-plus"></i>设置目标</a>
                            </div>
                        </div>
                        <!--订阅项目-->
                        <div class="SY-subscribe br5">
                            <h2 class="title">订阅项目</h2>
                            <div class="subscribeList">
                                <div class="sub-item">
                                    <h3 class="sub-title">订阅内容标题</h3>
                                    <p class="sub-text fold">对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈</p>
                                    <span class="tar pr spread">
                                        <i class="word">展开</i>
                                        <i class="fa fa-angle-double-down"></i>
                                    </span>
                                    <div class="courseMsg">
                                        <p class="openTime">开放订阅时间：<span>2018.5.13</span></p>
                                        <p class="populationLimit dib">人数限制：<span>200</span></p>
                                        <p class="extraPopulation dib">还剩：<span>200</span></p>
                                    </div>
                                    <a class="br5 tac transition buyBtn" href="payCenter.html" target="_blank"><span class="price">￥1</span>获得</a>
                                </div>
                                <div class="sub-item">
                                    <h3 class="sub-title">订阅内容标题</h3>
                                    <div class="pic">
                                        <img src="https://cdna.artstation.com/p/assets/images/images/001/337/630/large/wl-op-7s.jpg?1444639378" alt="">
                                        <img src="https://cdnb.artstation.com/p/assets/images/images/005/196/445/large/wl-op-19s.jpg?1489218074" alt="">
                                    </div>
                                    <p class="sub-text fold">对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺对于支持者的回馈承诺</p>
                                    <span class="tar pr spread">
                                        <i class="word">展开</i>
                                        <i class="fa fa-angle-double-down"></i>
                                    </span>
                                    <div class="courseMsg">
                                        <p class="openTime">开放订阅时间：<span>2018.5.13</span></p>
                                        <p class="populationLimit dib">人数限制：<span>200</span></p>
                                        <p class="extraPopulation dib">还剩：<span>200</span></p>
                                    </div>
                                    <a class="br5 tac transition buyBtn" href="payCenter.html" target="_blank"><span class="price">￥99</span>获得</a>
                                </div>
                            </div>
                            <!--缺省提示-->
                            <div class="emptyInfo tac dn">
                                <p class="tips tal">为支持者分享优质的内容，说明支持者可获得的内容奖励，同时获得一份额外的收入。</p>
                                <a class="db br5 transition setRewardBtn" href="javascript:void(0);">设置奖励</a>
                            </div>
                        </div>
                    </div>
                </div>
                <!--动态-->
                <div class="SY-dynamic clearfix dn">
                    <div class="leftNav fl">
                        <!--loading-->
                        <div class="loading tac dn">
                            <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
                        </div>
                        <div class="subscriptItem br5">
                            <h2 class="title">订阅项目</h2>
                            <div class="tagsBox">
                                <a href="javascript:void(0);" class="tag dib free">免费</a>
                                <a href="javascript:void(0);" class="tag dib">tag1</a>
                                <a href="javascript:void(0);" class="tag dib active">黑豹教程</a>
                                <a href="javascript:void(0);" class="tag dib">这是一个订阅项目</a>
                            </div>
                            <!--缺省提示-->
                            <div class="emptyInfo tac dn">
                                <div class="icon"></div>
                                <!--作者视角-->
                                <p class="tips">还未上传作品集哦，赶快去<a href="javascript:void(0);">发布</a>吧~</p>
                                <!--访客视角-->
                                <p class="tips">暂无相关内容哦~</p>
                            </div>
                        </div>
                        <div class="albumItem br5">
                            <div class="clearfix">
                                <h2 class="title fl">合集项目</h2>
                                <a class="db transition tac fr buildNewBtn" href="BuildNewAlbum.html"><i class="fa fa-plus"></i>新建</a>
                            </div>
                            <div class="tagsBox">
                                <a href="javascript:void(0);" class="tag dib">合集项目</a>
                                <a href="javascript:void(0);" class="tag dib">tag1</a>
                                <a href="javascript:void(0);" class="tag dib">黑豹教程</a>
                                <a href="javascript:void(0);" class="tag dib">这是一个合集项目</a>
                            </div>
                            <div class="controlAlbum clearfix">
                                    <a class="db transition tac fr controlBtn" href="MoreAlbum.html">管理合集</a>
                            </div>
                            <!--缺省提示-->
                            <div class="emptyInfo tac dn">
                                <div class="icon"></div>
                                <!--作者视角-->
                                <p class="tips">还未上传作品集哦，赶快去<a href="javascript:void(0);">发布</a>吧~</p>
                                <!--访客视角-->
                                <p class="tips">暂无相关内容哦~</p>
                            </div>
                        </div>
                        <div class="tagsItem br5">
                            <h2 class="title">标签</h2>
                            <div class="tagsBox">
                                <a href="javascript:void(0);" class="tag dib">标签一</a>
                                <a href="javascript:void(0);" class="tag dib">tag1</a>
                                <a href="javascript:void(0);" class="tag dib">黑豹教程</a>
                                <a href="javascript:void(0);" class="tag dib">Maya</a>
                            </div>
                            <!--缺省提示-->
                            <div class="emptyInfo tac dn">
                                <div class="icon"></div>
                                <!--作者视角-->
                                <p class="tips">还未上传作品集哦，赶快去<a href="javascript:void(0);">发布</a>吧~</p>
                                <!--访客视角-->
                                <p class="tips">暂无相关内容哦~</p>
                            </div>
                        </div>
                    </div>
                    <div class="statusBox br5 fr">
                        <div class="statusNav clearfix">
                            <h2 class="title fl">TA的动态</h2>
                            <div class="navTab usn fr clearfix">
                                <div class="arrayWays fr">
                                    <span class="dib active normal"></span>
                                    <span class="dib grid"></span>
                                </div>
                                <ul class="tab fr">
                                    <li class="dib active"><span>最新发布</span></li>
                                    <li class="dib"><span>最高热度</span></li>
                                </ul>
                            </div>
                        </div>
                        <div class="subNav usn br5">
                            <ul>
                                <li class="item dib active"><a href="javascript:void(0);">全部<span class="num">30</span></a></li>
                                <li class="item dib"><a href="javascript:void(0);">文本<span class="num">8</span></a></li>
                                <li class="item dib"><a href="javascript:void(0);">图片<span class="num">8</span></a></li>
                                <li class="item dib"><a href="javascript:void(0);">文章<span class="num">4</span></a></li>
                                <li class="item dib"><a href="javascript:void(0);">视频<span class="num">6</span></a></li>
                                <li class="item dib"><a href="javascript:void(0);">直播<span class="num">12</span></a></li>
                            </ul>
                        </div>
                        <div class="statusList">
                            <!--列表模式-->
                            <div class="statusContent">
                                <!--图片-->
                                <div class="recommend-item clearfix">
                                    <div class="item-pic re-picture br5 fl pr">
                                        <div class="morePic tac br5 pa">
                                            <i class="fa fa-picture-o"></i>
                                            <span class="num">7</span>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Gallery/iPWeMRutjGRqjpz694WY6Hucxu0KLxeC/DzM9dqEAsJNsgHrIyJEyG6r14723yIg6jNPAB57m1RYxkM_O6G9Y764xyOaunIC8.jpg')">
                                        </a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-title toe fl" href="javascript:void(0)">这是该图片的名称</a>
                                            <p class="item-price fr"><i class="fa fa-unlock"></i><span>￥1--黑豹课程</span></p>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="recommend-item pay clearfix">
                                    <div class="item-pic picture br5 fl pr">
                                        <div class="morePic tac br5 pa">
                                            <i class="fa fa-picture-o"></i>
                                            <span class="num">7</span>
                                        </div>
                                        <div class="lockCover tac pa">
                                            <p class="icon"><i class="fa fa-lock"></i></p>
                                            <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Gallery/iPWeMRutjGRqjpz694WY6Hucxu0KLxeC/DzM9dqEAsJNsgHrIyJEyG6r14723yIg6jNPAB57m1RYxkM_O6G9Y764xyOaunIC8.jpg')">
                                            <div class="cover pa transition"></div>
                                        </a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-title toe fl" href="javascript:void(0)">这是该图片的名称</a>
                                            <p class="item-price fr"><i class="fa fa-lock"></i><span>￥1--黑豹课程</span></p>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!--视频-->
                                <div class="recommend-item clearfix">
                                    <div class="item-pic re-video br5 fl pr">
                                        <div class="playIcon pa">
                                            <i class="fa fa-play-circle-o"></i>
                                        </div>
                                        <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/000/826/927/large/wl-op-1.jpg?1443929888')">
                                            <div class="cover transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-title toe fl" href="javascript:void(0)">这是该视频的名称</a>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="recommend-item pay clearfix">
                                    <div class="item-pic re-video  br5 fl pr">
                                        <div class="lockCover tac pa">
                                            <p class="icon"><i class="fa fa-lock"></i></p>
                                            <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                        </div>
                                        <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/000/826/927/large/wl-op-1.jpg?1443929888')">
                                            <div class="cover transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-title toe fl" href="javascript:void(0)">这是该视频的名称</a>
                                            <p class="item-price fr"><i class="fa fa-lock"></i><span>￥1--黑豹课程</span></p>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!--直播-->
                                <div class="recommend-item clearfix">
                                    <div class="item-pic re-living br5 fl pr">
                                        <div class="livingTip tac br5 pa">
                                            <i class="fa fa-video-camera"></i>
                                        </div>
                                        <div class="living pa tac">
                                            <div class="liveSoon dn">
                                                <p class="text">即将直播</p>
                                                <p class="text timeTip">距离直播开始还剩<br><span class="day">30</span>天<span class="hour">23</span>小时<span class="minute">30</span>分</p>
                                            </div>
                                            <div class="liveNow d n">
                                                <p class="livingIcon"></p>
                                                <p class="text">正在直播</p>
                                            </div>
                                            <div class="livefinish dn">
                                                <p class="text">直播已结束</p>
                                            </div>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/001/337/630/large/wl-op-7s.jpg?1444639378')">
                                            <div class="cover transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-title toe fl" href="javascript:void(0)">这是该直播的名称</a>
                                            <p class="item-price fr"><i class="fa fa-unlock"></i><span>￥1--黑豹课程</span></p>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="recommend-item pay clearfix">
                                    <div class="item-pic re-living br5 fl pr">
                                        <div class="livingTip tac br5 pa">
                                            <i class="fa fa-video-camera"></i>
                                        </div>
                                        <div class="lockCover tac pa">
                                            <p class="icon"><i class="fa fa-lock"></i></p>
                                            <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/001/337/630/large/wl-op-7s.jpg?1444639378')">
                                            <div class="cover transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-title toe fl" href="javascript:void(0)">这是该直播的名称</a>
                                            <p class="item-price fr"><i class="fa fa-lock"></i><span>￥1--黑豹课程</span></p>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!--文章-->
                                <div class="recommend-item clearfix">
                                    <div class="item-pic re-article br5 fl pr">
                                        <div class="articleIcon br50 tac pa">
                                            <i class="fa fa-file-text"></i>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://wx1.sinaimg.cn/crop.0.39.800.449.1000/006Tr4asgy1fnrrrnjfhij30m80fojw8.jpg')"></a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-title toe fl" href="javascript:void(0)">这是该文章的名称</a>
                                            <p class="item-price fr"><i class="fa fa-unlock"></i><span>￥1--黑豹课程</span></p>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="recommend-item pay clearfix">
                                    <div class="item-pic re-article br5 fl pr">
                                        <div class="articleIcon br50 tac pa">
                                            <i class="fa fa-file-text"></i>
                                        </div>
                                        <div class="lockCover tac pa">
                                            <p class="icon"><i class="fa fa-lock"></i></p>
                                            <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://wx1.sinaimg.cn/crop.0.39.800.449.1000/006Tr4asgy1fnrrrnjfhij30m80fojw8.jpg')">
                                            <div class="cover transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-title toe fl" href="javascript:void(0)">这是该文章的名称</a>
                                            <p class="item-price fr"><i class="fa fa-lock"></i><span>￥1--黑豹课程</span></p>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                    <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!--文本-->
                                <div class="recommend-item clearfix">
                                    <div class="item-infos re-text fl pr">
                                        <div class="putTop pa">
                                            <i class="fa fa-bookmark"></i>
                                            <span class="pa">顶</span>
                                        </div>
                                        <div class="item-top clearfix">
                                            <span class="item-time fr">2018-05-15</span>
                                        </div>
                                        <p class="item-desc">这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述这是该课程的简单描述</p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>下架</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="recommend-item pay clearfix">
                                    <div class="item-pic re-text br5 fl pr">
                                        <div class="articleIcon br50 tac pa">
                                            <i class="fa fa-file-text"></i>
                                        </div>
                                        <div class="lockCover tac pa">
                                            <p class="icon"><i class="fa fa-lock"></i></p>
                                            <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('img/personalCenter/defaultPic.jpg')">
                                            <div class="cover transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-infos fl">
                                        <div class="item-top clearfix">
                                            <a class="item-text toe fl" href="javascript:void(0)">该文本的缩略内容该文本的缩略内容该文本的缩略内容</a>
                                            <p class="item-price fr"><i class="fa fa-lock"></i><span>￥1--黑豹课程</span></p>
                                        </div>
                                        <p class="item-time">2018-05-15</p>
                                        <p class="item-desc"></p>
                                        <div class="item-msg clearfix">
                                            <p class="item-tags fl">
                                                <i class="fa fa-tag"></i>
                                                <span class="tag">tag1</span>
                                                <span class="tag">tag2</span>
                                                <span class="tag">tag3</span>
                                            </p>
                                            <div class="item-society fr pr">
                                                <p class="dib scan"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                                <a href="javascript:void(0);" class="dib comments"><i class="fa fa-commenting"></i><span class="num">20</span></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></a>
                                                <div class="dib share pr">
                                                    <a href="javascript:void(0);"><i class="fa fa-share"></i><span class="num">15</span></a>
                                                    <div class="shareWays br5 border1 pa">
                                                        <span class="pa"></span>
                                                        <div class="bdsharebuttonbox share-ways-button bdshare-button-style0-32" data-tag="share_1" data-bd-bind="1526372066100">
                                                            <a class="br50 bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a>
                                                            <a class="br50 bds_weixin" data-cmd="weixin" title="分享到微信"></a>
                                                            <a class="br50 bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
                                                            <a class="br50 bds_tsina" data-cmd="tsina" style="margin-right:0;" title="分享到新浪微博"></a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <a href="javascript:void(0);" class="dib ellipsis pr"><i class="fa fa-ellipsis-h"></i></a>
                                                <div class="unormal pa border1 br5 dn">
                                                    <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                    <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                    <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>下架</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!--分页-->
                                <div class="page tac">
                                    <ul class="pageList pr clearfix">
                                        <li class="text disable"><a href="javascript:void(0);">首页</a></li>
                                        <li class="text disable"><a href="javascript:void(0);">上一页</a></li>
                                        <li class="pageActive"><a href="javascript:void(0);">1</a></li>
                                        <li><a href="javascript:void(0);">2</a></li>
                                        <li><a href="javascript:void(0);">3</a></li>
                                        <li><a href="javascript:void(0);">...</a></li>
                                        <li class="text"><a href="javascript:void(0);">下一页</a></li>
                                        <li class="text"><a href="javascript:void(0);">尾页</a></li>
                                    </ul>
                                </div>
                            </div>
                            <!--九宫格模式-->
                            <div class="statusGrid clearfix dn">
                                <!--图片-->
                                <div class="recommend-item fl br5 border1">
                                    <div class="item-pic re-picture pr">
                                        <div class="picIcon br5 pa"><i class="fa fa-picture-o"></i><span class="num">7</span></div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Gallery/iPWeMRutjGRqjpz694WY6Hucxu0KLxeC/DzM9dqEAsJNsgHrIyJEyG6r14723yIg6jNPAB57m1RYxkM_O6G9Y764xyOaunIC8.jpg')"></a>
                                    </div>
                                    <div class="item-msg">
                                        <a href="javascript:void(0);" class="item-name toe">这是该图片的名称</a>
                                        <div class="item-detail pr clearfix">
                                            <p class="item-time fl">2018-05-15</p>
                                            <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa border1 br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <div class="item-society">
                                            <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                            <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">20</span></p>
                                            <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></p>
                                        </div>
                                    </div>
                                </div>
                                <div class="recommend-item fl pay br5 border1">
                                    <div class="item-pic re-picture pr">
                                        <div class="picIcon br5 pa"><i class="fa fa-picture-o"></i><span class="num">7</span></div>
                                        <div class="lockCover tac pa">
                                            <p class="icon"><i class="fa fa-lock"></i></p>
                                            <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                        </div>
                                        <a class="db" href="javascript:void(0);" style="background-image:url('http://img.yxs.shenyecg.com/Gallery/iPWeMRutjGRqjpz694WY6Hucxu0KLxeC/DzM9dqEAsJNsgHrIyJEyG6r14723yIg6jNPAB57m1RYxkM_O6G9Y764xyOaunIC8.jpg')">
                                            <div class="coverPic transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-msg">
                                        <a href="javascript:void(0);" class="item-name toe">这是该图片的名称</a>
                                        <div class="item-detail pr clearfix">
                                            <p class="item-time fl">2018-05-15</p>
                                            <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa border1 br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <div class="item-society">
                                            <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                            <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">20</span></p>
                                            <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></p>
                                        </div>
                                    </div>
                                </div>
                                <!--视频-->
                                <div class="recommend-item fl br5 border1">
                                    <div class="item-pic re-video pr">
                                        <div class="playIcon pa">
                                            <i class="fa fa-play-circle-o"></i>
                                        </div>
                                        <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/000/826/927/large/wl-op-1.jpg?1443929888')">
                                            <div class="coverPic transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-msg">
                                        <a href="javascript:void(0);" class="item-name toe">这是该视频的名称</a>
                                        <div class="item-detail pr clearfix">
                                            <p class="item-time fl">2018-05-15</p>
                                            <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa border1 br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <div class="item-society">
                                            <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                            <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">20</span></p>
                                            <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></p>
                                        </div>
                                    </div>
                                </div>
                                <div class="recommend-item fl pay br5 border1">
                                    <div class="item-pic re-video pr">
                                        <div class="lockCover tac pa">
                                            <p class="icon"><i class="fa fa-lock"></i></p>
                                            <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                        </div>
                                        <div class="playTips tac br5 pa"><i class="fa fa-play"></i></div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdnb.artstation.com/p/assets/images/images/000/826/927/large/wl-op-1.jpg?1443929888')">
                                            <div class="coverPic transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-msg">
                                        <a href="javascript:void(0);" class="item-name toe">这是该视频的名称</a>
                                        <div class="item-detail pr clearfix">
                                            <p class="item-time fl">2018-05-15</p>
                                            <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa border1 br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <div class="item-society">
                                            <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                            <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">20</span></p>
                                            <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></p>
                                        </div>
                                    </div>
                                </div>
                                <!--直播-->
                                <div class="recommend-item fl br5 border1">
                                    <div class="item-pic re-living pr">
                                        <div class="livingTip tac br5 pa">
                                            <i class="fa fa-video-camera"></i>
                                        </div>
                                        <div class="living pa tac">
                                            <div class="liveSoon dn">
                                                <p class="text">即将直播</p>
                                                <p class="text timeTip">距离直播开始还剩<br><span class="day">30</span>天<span class="hour">23</span>小时<span class="minute">30</span>分</p>
                                            </div>
                                            <div class="liveNow d n">
                                                <p class="livingIcon"></p>
                                                <p class="text">正在直播</p>
                                            </div>
                                            <div class="livefinish dn">
                                                <p class="text">直播已结束</p>
                                            </div>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/001/337/630/large/wl-op-7s.jpg?1444639378')">
                                            <div class="coverPic transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-msg">
                                        <a href="javascript:void(0);" class="item-name toe">这是该直播的名称</a>
                                        <div class="item-detail pr clearfix">
                                            <p class="item-time fl">2018-05-15</p>
                                            <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa border1 br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <div class="item-society">
                                            <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                            <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">20</span></p>
                                            <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></p>
                                        </div>
                                    </div>
                                </div>
                                <div class="recommend-item fl pay br5 border1">
                                    <div class="item-pic re-living pr">
                                        <div class="livingTip tac br5 pa">
                                            <i class="fa fa-video-camera"></i>
                                        </div>
                                        <div class="lockCover tac pa">
                                            <p class="icon"><i class="fa fa-lock"></i></p>
                                            <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://cdna.artstation.com/p/assets/images/images/001/337/630/large/wl-op-7s.jpg?1444639378')">
                                            <div class="coverPic transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-msg">
                                        <a href="javascript:void(0);" class="item-name toe">这是该直播的名称</a>
                                        <div class="item-detail pr clearfix">
                                            <p class="item-time fl">2018-05-15</p>
                                            <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa border1 br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <div class="item-society">
                                            <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                            <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">20</span></p>
                                            <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></p>
                                        </div>
                                    </div>
                                </div>
                                <!--文章-->
                                <div class="recommend-item fl br5 border1">
                                    <div class="item-pic re-article pr">
                                        <div class="articleIcon br50 tac pa">
                                            <i class="fa fa-file-text"></i>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://wx1.sinaimg.cn/crop.0.39.800.449.1000/006Tr4asgy1fnrrrnjfhij30m80fojw8.jpg')"></a>
                                    </div>
                                    <div class="item-msg">
                                        <a href="javascript:void(0);" class="item-name toe">这是该直播的名称</a>
                                        <div class="item-detail pr clearfix">
                                            <p class="item-time fl">2018-05-15</p>
                                            <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa border1 br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <div class="item-society">
                                            <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                            <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">20</span></p>
                                            <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></p>
                                        </div>
                                    </div>
                                </div>
                                <div class="recommend-item fl pay br5 border1">
                                    <div class="item-pic re-article pr">
                                        <div class="articleIcon br50 tac pa">
                                            <i class="fa fa-file-text"></i>
                                        </div>
                                        <div class="lockCover tac pa">
                                            <p class="icon"><i class="fa fa-lock"></i></p>
                                            <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('https://wx1.sinaimg.cn/crop.0.39.800.449.1000/006Tr4asgy1fnrrrnjfhij30m80fojw8.jpg')">
                                            <div class="coverPic transition pa"></div>
                                        </a>
                                    </div>
                                    <div class="item-msg">
                                        <a href="javascript:void(0);" class="item-name toe">这是该直播的名称</a>
                                        <div class="item-detail pr clearfix">
                                            <p class="item-time fl">2018-05-15</p>
                                            <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa border1 br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                        <p class="item-classify">数字2D-2D动画</p>
                                        <div class="item-society">
                                            <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                            <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">20</span></p>
                                            <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></p>
                                        </div>
                                    </div>
                                </div>
                                <!--文本-->
                                <div class="recommend-item fl br5 border1">
                                    <div class="item-pic re-txt pr">
                                        <div class="text pa">这是该文本的缩略内容这是该文本的缩略内容这是该文本的缩略内容这是该文本的缩略内容这是该文本的缩略内容这是该文本的缩略内容</div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('img/personalCenter/txtBg.png')"></a>
                                    </div>
                                    <div class="item-msg">
                                        <a href="javascript:void(0);" class="item-name toe">&nbsp;</a>
                                        <div class="item-detail pr clearfix">
                                            <p class="item-time fl">2018-05-15</p>
                                            <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa border1 br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                        <div class="item-society">
                                            <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                            <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">20</span></p>
                                            <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></p>
                                        </div>
                                    </div>
                                </div>
                                <div class="recommend-item fl pay br5 border1">
                                    <div class="item-pic re-txt pr">
                                        <div class="lockCover tac pa">
                                            <p class="icon"><i class="fa fa-lock"></i></p>
                                            <a class="db tac transition br5 buyBtn" href="javascript:void(0);">订阅观看</a>
                                        </div>
                                        <a class="db pr" href="javascript:void(0);" style="background-image:url('img/personalCenter/txtBg.png')"></a>
                                    </div>
                                    <div class="item-msg">
                                        <a href="javascript:void(0);" class="item-name toe">&nbsp;</a>
                                        <div class="item-detail pr clearfix">
                                            <p class="item-time fl">2018-05-15</p>
                                            <a href="javascript:void(0);" class="ellipsis pr dib fr"><i class="fa fa-ellipsis-h"></i></a>
                                            <div class="unormal pa border1 br5 dn">
                                                <a href="javascript:void(0);" class="db stick"><i class="fa fa-step-backward fa-rotate-90"></i><span>置顶</span></a>
                                                <a href="javascript:void(0);" class="db recommend"><i class="fa fa-thumbs-up"></i>推荐</a>
                                                <a href="javascript:void(0);" class="db rewrite"><i class="fa fa-pencil"></i>编辑</a>
                                                <a href="javascript:void(0);" class="db remove"><i class="fa fa-trash"></i>删除</a>
                                            </div>
                                        </div>
                                        <div class="item-society">
                                            <p class="item-seen dib"><i class="fa fa-eye"></i><span class="num">340</span></p>
                                            <p class="item-comment dib"><i class="fa fa-commenting"></i><span class="num">20</span></p>
                                            <p class="item-thumbUp dib"><i class="fa fa-thumbs-o-up"></i><span class="num">40</span></p>
                                        </div>
                                    </div>
                                </div>
                                <!--分页-->
                                <div class="page tac">
                                    <ul class="pageList pr clearfix">
                                        <li class="text disable"><a href="javascript:void(0);">首页</a></li>
                                        <li class="text disable"><a href="javascript:void(0);">上一页</a></li>
                                        <li class="pageActive"><a href="javascript:void(0);">1</a></li>
                                        <li><a href="javascript:void(0);">2</a></li>
                                        <li><a href="javascript:void(0);">3</a></li>
                                        <li><a href="javascript:void(0);">...</a></li>
                                        <li class="text"><a href="javascript:void(0);">下一页</a></li>
                                        <li class="text"><a href="javascript:void(0);">尾页</a></li>
                                    </ul>
                                </div>
                            </div>
                            <!--loading-->
                            <div class="loading tac dn">
                                <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
                            </div>
                            <!--缺省提示-->
                            <div class="emptyInfo tac dn">
                                <div class="icon"></div>
                                <!--作者视角-->
                                <p class="tips">分享优质内容，可以获得更多的订阅者，同时获得收益</p>
                                <a class="uploadBtn transition db br5" href="javascript:void(0);">上传作品</a>
                                <!--访客视角-->
                                <p class="tips dn">该作者并未创建任何内容哦~</p>
                            </div>
                        </div>
                    </div>
                </div>
                <!--留言板-->
                <div class="SY-leaveWord dn">
                    <!--发表留言-->
                    <div class="user-leaveWord">
                        <h2 class="title">发表留言</h2>
                        <div class="user-writeBox">
                            <textarea class="br5 border1 db" placeholder="快来说点什么吧..." onfocus="this.placeholder=''" onblur="this.placeholder='快来说点什么吧...'"></textarea>
                            <div class="tar user-publish">
                                <p class="dib wordsLimit warning"><span>1001</span>/1000</p>
                                <a class="dib br5 transition tac publish-btn" href="javascript:void(0);">发表</a>
                            </div>
                        </div>
                    </div>
                    <!--全部留言-->
                    <div class="user-wordBox">
                        <div class="user-tab clearfix">
                            <h2 class="title fl">全部留言<span class="num">(100)</span></h2>
                            <ul class="navTab usn fr">
                                <li class="dib active"><span>默认时间</span></li>
                                <li class="dib"><span>最高热度</span></li>
                            </ul>
                        </div>
                        <div class="user-wordList">
                            <!--加载中-->
                            <div class="loading tac dn">
                                <i class="fa fa-spinner fa-pulse fa-3x fa-fw"></i>
                            </div>
                            <!--缺省提示-->
                            <div class="emptyInfo tac dn">
                                <div class="icon"></div>
                                <p class="tips">还没有人给你留言哦~</p>
                            </div>
                            <div class="wordList">
                                <div class="word-item clearfix">
                                    <div class="user-avatar br50 fl">
                                        <a href="javascript:void(0);"><img src="http://img.yxs.shenyecg.com/Image/h8VE1fiHlWerj0FrkEUSYlLa4m3sppLi/KECAnarYPG.jpg" alt=""></a>
                                    </div>
                                    <div class="user-operation fl">
                                        <div class="user-msg pr">
                                            <div class="user-detail">
                                                <a href="javascript:void(0);" class="user-nickName">路人甲</a>
                                            </div>
                                            <div class="user-control pa">
                                                <a class="pa icon" href="javascript:void(0);"><i class="fa fa-caret-down transition"></i></a>
                                                <ul class="pa selectBox">
                                                    <li><a class="db transition delete" href="javascript:void(0);">删除</a></li>
                                                </ul>
                                            </div>
                                        </div>
                                        <div class="user-word">这是该用户的留言...</div>
                                        <div class="user-infos clearfix">
                                            <div class="time fl"><span>2018-05-10</span><span>16:40:00</span></div>
                                            <div class="infos tar fr">
                                                <a href="javascript:void(0);" class="dib leaveWords"><i class="fa fa-commenting"></i></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">640</span></a>
                                            </div>
                                        </div>
                                        <div class="mainComment pr">
                                            <span class="pa triangle"></span>
                                            <input class="br5 user-write" type="text" placeholder="回复&nbsp;路人甲" onfocus="this.placeholder=''" onblur="this.placeholder='回复&nbsp;路人甲'">
                                            <div class="btns">
                                                <a class="dib br5 transition tac confirm" href="javascript:void(0);">确认</a>
                                                <a class="dib br5 transition tac cancel" href="javascript:void(0);">取消</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="word-item clearfix">
                                    <div class="user-avatar br50 fl">
                                        <a href="javascript:void(0);"><img src="http://img.yxs.shenyecg.com/Image/h8VE1fiHlWerj0FrkEUSYlLa4m3sppLi/KECAnarYPG.jpg" alt=""></a>
                                    </div>
                                    <div class="user-operation fl">
                                        <div class="user-msg pr">
                                            <div class="user-detail">
                                                <a href="javascript:void(0);" class="user-nickName">路人甲</a>
                                            </div>
                                            <div class="user-control pa">
                                                <a class="pa icon" href="javascript:void(0);"><i class="fa fa-caret-down transition"></i></a>
                                                <ul class="pa selectBox">
                                                    <li><a class="db transition delete" href="javascript:void(0);">删除</a></li>
                                                </ul>
                                            </div>
                                        </div>
                                        <div class="user-word">这是该用户的留言...</div>
                                        <div class="user-infos clearfix">
                                            <div class="time fl"><span>2018-05-10</span><span>16:40:00</span></div>
                                            <div class="infos tar fr">
                                                <a href="javascript:void(0);" class="dib leaveWords"><i class="fa fa-commenting"></i></a>
                                                <a href="javascript:void(0);" class="dib thumbsUp"><i class="fa fa-thumbs-o-up"></i><span class="num">640</span></a>
                                            </div>
                                        </div>
                                        <div class="mainComment dn pr">
                                            <span class="pa triangle"></span>
                                            <input class="br5 user-write" type="text" placeholder="回复&nbsp;路人甲" onfocus="this.placeholder=''" onblur="this.placeholder='回复&nbsp;路人甲'">
                                            <div class="btns">
                                                <a class="dib br5 transition tac confirm" href="javascript:void(0);">确认</a>
                                                <a class="dib br5 transition tac cancel" href="javascript:void(0);">取消</a>
                                            </div>
                                        </div>
                                        <div class="user-comments pr">
                                            <div class="comment-box">
                                                <div class="comment-item clearfix">
                                                    <div class="avatar fl br50">
                                                        <a href="javascript:void(0);"><img src="http://img.yxs.shenyecg.com/Image/CDg8sf6s33evuVtkHpzHEcXJbaOzq41y/2W74tQNZPB.jpg" alt=""></a>
                                                    </div>
                                                    <div class="main-item fl">
                                                        <div class="main-words">
                                                            <p class="dib users"><span class="nickName">路人乙</span><i>回复</i><span class="nickName">路人甲：</span></p>
                                                            <span class="text">So say goodbye and hit the road.Pack it up and disappear.You better have some place to go.</span>
                                                        </div>
                                                        <div class="infos">
                                                            <p class="dib time"><span>2018-05-11</span><span>13:52:52</span></p>
                                                            <p class="dib operation">
                                                                <a class="reply" href="javascript:void(0);">回复</a>
                                                                <a class="delete" href="javascript:void(0);">删除</a>
                                                            </p>
                                                        </div>
                                                        <div class="writeComments pr">
                                                            <span class="pa triangle"></span>
                                                            <input class="br5 user-write" type="text" placeholder="回复&nbsp;路人甲" onfocus="this.placeholder=''" onblur="this.placeholder='回复&nbsp;路人甲'">
                                                            <div class="btns">
                                                                <a class="dib br5 transition tac confirm" href="javascript:void(0);">确认</a>
                                                                <a class="dib br5 transition tac cancel" href="javascript:void(0);">取消</a>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="comment-item clearfix">
                                                    <div class="avatar fl br50">
                                                        <a href="javascript:void(0);"><img src="http://img.yxs.shenyecg.com/Image/CDg8sf6s33evuVtkHpzHEcXJbaOzq41y/2W74tQNZPB.jpg" alt=""></a>
                                                    </div>
                                                    <div class="main-item fl">
                                                        <div class="main-words">
                                                            <p class="dib users"><span class="nickName">路人乙</span><i>回复</i><span class="nickName">路人甲：</span></p>
                                                            <span class="text">So say goodbye and hit the road.Pack it up and disappear.You better have some place to go.'Cause you can't come back around here.Good goodbye.Don't you come back no more.Live from the rhythm it's.Something wild venomous.Enemies trying to read me</span>
                                                        </div>
                                                        <div class="infos">
                                                            <p class="dib time"><span>2018-05-11</span><span>13:52:52</span></p>
                                                            <p class="dib operation">
                                                                <a class="reply" href="javascript:void(0);">回复</a>
                                                                <a class="delete" href="javascript:void(0);">删除</a>
                                                            </p>
                                                        </div>
                                                        <div class="writeComments pr">
                                                            <span class="pa triangle"></span>
                                                            <input class="br5 user-write" type="text" placeholder="回复&nbsp;路人甲" onfocus="this.placeholder=''" onblur="this.placeholder='回复&nbsp;路人甲'">
                                                            <div class="btns">
                                                                <a class="dib br5 transition tac confirm" href="javascript:void(0);">确认</a>
                                                                <a class="dib br5 transition tac cancel" href="javascript:void(0);">取消</a>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="comment-page tar dn">
                                                <a class="backIndexBtn" href="javascript:void(0);">回到首页</a>
                                                <a class="nextBtn" href="javascript:void(0);">下一页</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="page tac dn">
                            <ul class="pageList pr clearfix">
                                <li class="text disable"><a href="javascript:void(0);">首页</a></li>
                                <li class="text disable"><a href="javascript:void(0);">上一页</a></li>
                                <li class="pageActive"><a href="javascript:void(0);">1</a></li>
                                <li><a href="javascript:void(0);">2</a></li>
                                <li><a href="javascript:void(0);">3</a></li>
                                <li><a href="javascript:void(0);">...</a></li>
                                <li class="text"><a href="javascript:void(0);">下一页</a></li>
                                <li class="text"><a href="javascript:void(0);">尾页</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--主内容 结束-->
<!--页脚 开始-->
<div class="SY-footer">
    <div class="SY-foot clearfix">
        <div class="aboutUs fl">
            <div class="logoBox">
                <img src="img/icons/bottomLogo.png" alt="">
                <p class="dib slogin">深夜研习社</p>
                <span class="line dib"></span>
                <p class="dib text">知识应该受到尊重</p>
            </div>
            <div class="connectUs">
                <p class="text dib">联系我们:<span class="phoneNumer dib">027-62438159</span></p>
                <a href="javascript:void(0);" class="tencent linkIcon"></a>
            </div>
        </div>
        <div class="msgDetail fr clearfix">
            <ul class="iconList fr">
                <li class="pr">
                    <span class="wechat linkIcon"></span>
                    <div class="weChatCode tac pa">
                        <i class="icon-arrow-down pa"></i>
                        <p class="scan">扫描二维码</p>
                        <p class="text">关注微信公众号</p>
                        <img src="img/icons/WeChatCode.jpg" alt="">
                    </div>
                </li>
                <li><a href="javascript:void(0);" class="sina linkIcon"></a></li>
            </ul>
            <dl class="fr">
                <dt><a href="HelpCenter.html">关于我们</a></dt>
            </dl>
            <dl class="fr">
                <dt><a href="HelpCenter.html">服务条款</a></dt>
            </dl>
            <dl class="fr">
                <dt><a href="HelpCenter.html">版权申明</a></dt>
            </dl>
            <dl class="fr">
                <dt><a href="HelpCenter.html">常见问题</a></dt>
            </dl>
            <p class="recordNumber"><a href="javascript:void(0);">Copyright&copy; www.shenyecg.com 2017 | 鄂ICP备16021987号-1</a></p>
        </div>
    </div>
</div>
<!--页脚 结束-->
<script src="js/jquery.min.js"></script>
<script src="js/search.js"></script>
<script>
    $(function () {
        //导航切换
        $(".SY-wrapper .SY-navTab .item a").click(function () {
            var index = $(this).parent().index();
            $(this).parent().addClass("active").siblings().removeClass("active");
            $(".SY-wrapper .SY-mainBox > div").eq(index).removeClass("dn").siblings().addClass("dn");
        });

        //关注按钮点击事件
        $(".SY-wrapper .SY-userMsg .follow-btn").click(function () {
            $(this).toggleClass("active");
            $(this).hasClass("active") ? $(this).html("<i class='fa fa-check'></i>已关注") : $(this).html("<i class='fa fa-plus'></i>关注");
        });

        //点赞
        $(".SY-wrapper .user-wordList .thumbsUp").click(function () {
            $(this).toggleClass("active");
        });

        //热度 & 时间 -- 切换
        $(".SY-wrapper .user-tab .navTab li>span").click(function () {
            $(this).parent().addClass("active").siblings().removeClass("active");
        });

        //评论回复框显示隐藏
        $(".SY-wrapper .SY-mainBox .word-item .leaveWords").click(function () {
            $(this).parents(".user-infos").siblings(".mainComment").slideToggle();
        });

        //回复留言
        $(".SY-wrapper .SY-mainBox .comment-item .reply").click(function () {
            $(this).parents(".infos").siblings(".writeComments").slideToggle();
        });

        //留言列表是否显示分页
        var item_num = $(".SY-wrapper .SY-mainBox .user-wordList .word-item").length;
        if(item_num >= 20) {
            $(".SY-leaveWord .page").removeClass("dn");
        }else{
            $(".SY-leaveWord .page").addClass("dn");
        }

        //留言评论是否显示分页
        var comment_num = $(".SY-mainBox .user-wordList .comment-box .comment-item").length;
        if(comment_num >= 10) {
            $(".SY-mainBox .user-wordList .comment-page").removeClass("dn");
        }else{
            $(".SY-mainBox .user-wordList .comment-page").addClass("dn");
        }

        //删除按钮点击事件
        $(".SY-wrapper .SY-mainBox .user-operation .selectBox .delete").click(function () {
            $(this).parents(".word-item").remove();
            var item_num = $(".SY-wrapper .SY-mainBox .user-wordList .word-item").length;
            if(item_num < 20){
                $(".SY-leaveWord .page").addClass("dn");
            }
            if(item_num <= 0) {
                $(".SY-leaveWord .user-wordList").find(".emptyInfo").removeClass("dn");
            }
        });

        //置顶 & 编辑 & 删除 选项显示与隐藏
        $(".SY-wrapper .recommend-item .ellipsis").click(function () {
            $(this).siblings(".unormal").slideToggle();
        });

        //主页作者推荐 -- 点赞
        $(".SY-wrapper .recommend-item .thumbsUp").click(function () {
            $(this).toggleClass("active");
        });

        //视频、直播、图片、文章 -- 置顶 & 取消置顶
        $(".SY-wrapper .recommend-item .stick").click(function () {
            var putTop = $("<div class='putTop pa'>" +
                           "    <i class='fa fa-bookmark'></i>" +
                           "    <span class='pa'>顶</span>" +
                           "</div>");
            if ($(this).hasClass("active")) {
                $(this).removeClass("active");
                $(this).find("span").html("置顶");
                $(this).parents(".recommend-item").find(".putTop").remove();
            }else{
                $(this).addClass("active");
                $(this).find("span").html("取消置顶");
                $(this).parents(".recommend-item").find(".item-pic").append(putTop);
            }

        });

        //右侧直播提示切换
        $(".SY-mainPage .SY-right .SY-liveTip .tipNav li").click(function () {
            var tip_index = $(this).index();
            $(this).addClass("active").siblings().removeClass("active");
            $(".SY-mainPage .SY-right .mainTipBox > div").eq(tip_index).removeClass("dn").siblings().addClass("dn");
        });

        //编辑公告
        $(".SY-mainPage .SY-right .SY-announcement .edit").click(function () {
           $(this).parents(".announcement").addClass("dn");
           $(".SY-mainPage .SY-announcement .editAnnounce").removeClass("dn");
        });
        $(".SY-mainPage .SY-right .SY-announcement .emptyInfo a").click(function () {
           $(this).parents(".emptyInfo").addClass("dn");
           $(".SY-mainPage .SY-right .SY-announcement .editAnnounce").removeClass("dn");
        });
        $(".SY-mainPage .SY-right .SY-announcement .editAnnounce .btns > a").click(function () {
            $(this).parents(".editAnnounce").addClass("dn");
            $(".SY-mainPage .SY-announcement .announcement").removeClass("dn");
        });

        //目标进度切换
        //左按钮
        var i = 0;
        var size = $(".targetProgress .target").length;
        $(".targetBox .prev").click(function () {
            if(i == 0){
                return
            }
            if(i > 0){
                $(this).siblings().removeClass("disable");
            }
            if(i == 1) {
                $(this).addClass("disable");
            }
            i --;
            move();
        });
        //右按钮
        $(".targetBox .next").click(function () {
            if(i == (size - 1)){
                return
            }
            if(i < (size - 1)){
                $(this).siblings().removeClass("disable");
            }
            if(i == (size - 2)){
                $(this).addClass("disable");
            }
            i ++;
            move();
        });
        //移动事件
        function move() {
            $(".targetProgress .target").stop().animate({ left: (-i) * 280,"transition":"all .3s" });
        };

        //订阅项目展开更多内容
        var spreadBtn = $(".SY-mainPage .SY-right .sub-item .spread");
        spreadBtn.click(function(){
            if($(this).prev(".sub-text").hasClass("fold")) {
                $(this).prev(".sub-text").removeClass("fold");
                $(this).find(".word").html("收起");
                $(this).find(".fa").removeClass("fa-angle-double-down").addClass("fa-angle-double-up");
            }else{
                $(this).prev(".sub-text").addClass("fold");
                $(this).find(".word").html("展开");
                $(this).find(".fa").removeClass("fa-angle-double-up").addClass("fa-angle-double-down");
            }
        });

        //动态statusBox 导航切换
        //九宫格切换
        $(".SY-dynamic .statusBox .arrayWays span").click(function () {
            var array_index = $(this).index();
            $(this).addClass("active").siblings().removeClass("active");
            $(".SY-dynamic .statusBox .statusList > div").eq(array_index).removeClass("dn").siblings().addClass("dn");
        });

        //最新发布 & 最高热度 切换
        $(".SY-dynamic .statusBox .tab li").click(function () {
            $(this).addClass("active").siblings().removeClass("active");
        })
    })
</script>
<script>
    window._bd_share_config = {
        common : {
            bdText : '自定义分享内容',
            bdDesc : '自定义分享摘要',
            bdUrl : '自定义分享url地址',
            bdPic : '自定义分享图片'
        },
        share : [{
            "bdSize" : 32
        }]
    };
    with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?cdnversion='+~(-new Date()/36e5)];
</script>
</body>
</html>